Connect wallet button [interchain UI part 2] #1014
Conversation
grod220
force-pushed
the
interchain-ui-part-2
branch
from
95b6ae3 to
ff845e9
Compare
There was a problem hiding this comment.
Component completely broken after interchain deps update. Went ahead and swapped it out for https://ui.shadcn.com/docs/components/combobox
| @@ -55,6 +55,7 @@ export const IbcChainProvider = ({ registry, children }: IbcProviderProps) => { | |||
| }, | |||
| }} | |||
| signerOptions={signerOptions} | |||
| modalTheme={{ defaultTheme: 'light' }} | |||
There was a problem hiding this comment.
Looks like the default changed to dark. Forcing the light theme here.
| @@ -11,7 +11,7 @@ export const IbcInForm = () => { | |||
| }} | |||
| > | |||
| <InterchainUi /> | |||
| <Button type='submit' variant='onLight'> | |||
| <Button type='submit' variant='onLight' disabled> | |||
There was a problem hiding this comment.
Disabling until we get to the end of building this flow
There was a problem hiding this comment.
Starting point: https://github.com/cosmology-tech/create-cosmos-app/blob/main/examples/asset-list/components/wallet/Wallet.tsx
Lifted, simplified, and changed to tailwind
| @@ -8,12 +8,12 @@ export const IbcLayout = () => { | |||
| <> | |||
| <div className="fixed inset-0 z-[-100] size-full bg-[url('penumbra-logo.svg')] bg-[length:160vmax] bg-fixed bg-[top_50%_left_25vw] bg-no-repeat" /> | |||
| <div className='flex flex-1 flex-col gap-4 md:flex-row md:place-content-around'> | |||
| <Card light className='relative overflow-visible md:self-start'> | |||
| <Card light className='relative z-10 overflow-visible md:self-start'> | |||
There was a problem hiding this comment.
So arrows don't overlap on top
| <LongArrowIcon | ||
| direction='right' | ||
| // Negative calculated margin giving lint issue | ||
| /* eslint-disable-next-line tailwindcss/enforces-negative-arbitrary-values */ | ||
| className='invisible absolute inset-y-0 right-0 my-auto -mr-[calc(30vw-3px)] size-[30vw] text-stone-300 md:visible' | ||
| className='invisible absolute -top-44 right-0 z-0 -mr-[calc(30vw-3px)] size-[30vw] text-stone-300 md:visible' |
There was a problem hiding this comment.
Relocated the arrows to be fixed versus floating in the middle of the card. That way, as the card changes size the arrows don't move.
grod220
requested review from
jessepinho,
Valentine1898,
TalDerei and
turbocrime
There was a problem hiding this comment.
LGTM!
I think that we should strive to make the IBC interface more intuitive for the user (like it is done by osmosis)
https://jam.dev/c/31161dd4-c42d-45c5-9357-c5ec177264a4
|
Definitely agree @Valentine1898, ideally we can later have a designer make this flow much nicer |
Secures connection approval from user intending to do an IBC in. Also, the recent updates of interchain ui seem to have broken the dropdown component. Went ahead and swapped it out for shadcn/ui components.
compressed.mp4